﻿@{
    ViewBag.Title = "Management";
    Layout = "~/Views/Shared/ListLayout.cshtml";
}

<!--layout-->
<div id="cc" class="easyui-layout" data-options="fit:true,border:false">
    <div data-options="region:'center',title:'角色列表'">
        <table id="dg" class="easyui-datagrid" data-options="border:false,fitColumns:true,pagination:true,fit:true,url:'@Url.Action("GetPagedList")',method:'get',toolbar:'#tb',onDblClickRow: onDblClickRow,onClickRow: onClickRow">
            <thead>
                <tr>
                    <th data-options="field:'Id',checkbox:true"></th>
                    <th data-options="field:'Name',width:80,editor:{type:'validatebox',options:{required:true}}">名称</th>
                    <th data-options="field:'Remark',width:100,editor:'text'">备注</th>
                </tr>
            </thead>
        </table>
    </div>
    <div data-options="region:'east',border:true,split:true,title:'分配模块'" style="width: 250px;">
        <div>
            <a href="#" class="easyui-linkbutton" iconcls="icon-save" plain="true" onclick="distributeModule()">分配</a>
            <a href="#" class="easyui-linkbutton" iconcls="icon-remove" plain="true" onclick="resetModule()">清空</a>
        </div>
        <ul class="easyui-tree" id="ttModule" data-options="url:'@Url.Action("GetAllModuleForTree", "Module")',parentField: 'parentId',checkbox:true,cascadeCheck:false"></ul>
    </div>
</div>
<!--/layout-->
<!--toolbar-->
<div id="tb">
    <div class="datagrid-toolbar-toolField">
        <div style="width: 70%; float: left">
            @*<a href="#" class="easyui-linkbutton" iconcls="icon-add" plain="true" onclick="append()">添加</a>
            <a href="#" class="easyui-linkbutton" iconcls="icon-remove" plain="true" onclick="onclickDelete()">删除</a>
            <span class="separator"></span>
            <a href="#" class="easyui-linkbutton" iconcls="icon-save" plain="true" onclick="onclickSave()">保存</a>
            <a href="#" class="easyui-linkbutton" iconcls="icon-undo" plain="true" onclick="reject()">放弃</a>
            <span class="separator"></span>
            <a href="#" class="easyui-linkbutton" iconcls="icon-search" plain="true" onclick="onclickSearch()">查询</a>*@
            @Html.Action("RenderToolbar", "Common", new { area = "" })
        </div>
        <div style="width: 30%; float: left;text-align:right">
            <a id="btnCollapse" href="#" class="easyui-linkbutton" iconcls="icon-collapse" plain="true"></a>
        </div>
    </div>
    <div id="pnlSearch" class="datagrid-toolbar-searchField">
        名称:<input type="text" id="serhName" placeholder="名称" />
    </div>
</div>
<!--/toolbar-->
@section Script{
    <script>

        var editIndex = undefined;

        $(function () {
            $('#btnCollapse').click(function () {
                $('#pnlSearch').toggle();
                $('#dg').datagrid('resize');
                var $collapse = $(this).find('.l-btn-text span:first');
                if ($collapse.hasClass('icon-collapse')) {
                    $collapse.removeClass('icon-collapse').addClass('icon-expand');
                } else {
                    $collapse.removeClass('icon-expand').addClass('icon-collapse');
                }
            });
        });

        //添加
        function append() {
            if (endEditing()) {
                $('#dg').datagrid('appendRow', { Name: '' });
                editIndex = $('#dg').datagrid('getRows').length - 1;
                $('#dg').datagrid('selectRow', editIndex)
                        .datagrid('beginEdit', editIndex);
            }
        }

        //取消
        function reject() {
            $('#dg').datagrid('rejectChanges');
            editIndex = undefined;
        }

        //结束编辑
        function endEditing() {
            if (editIndex == undefined) { return true; }
            var $dg = $('#dg');
            if ($dg.datagrid('validateRow', editIndex)) {
                $dg.datagrid('endEdit', editIndex);
                editIndex = undefined;
                return true;
            } else {
                return false;
            }
        }

        //双击行
        function onDblClickRow(index) {
            if (editIndex != index) {
                if (endEditing()) {
                    $('#dg').datagrid('selectRow', index)
                            .datagrid('beginEdit', index);
                    editIndex = index;
                } else {
                    $('#dg').datagrid('selectRow', editIndex);
                }
            }
        }

        //单击行
        function onClickRow(rowIndex, rowData) {
            var url = '@Url.Action("GetRelatedModuleAndAction")';

            if (!rowData.Id) {
                top.showAlert('请先保存角色列表!', 'warning');
                return false;
            }

            var data = { roleId: rowData.Id };
            $.get(url, data, function (data) {
                var $ttModule = $('#ttModule');
                resetModule();
                for (var i = 0; i < data.length; i++) {
                    var moduleId = data[i];
                    var node = $ttModule.tree('find', moduleId);
                    if (node) {
                        $ttModule.tree('check', node.target);
                    }
                }
            })
        }

        function resetModule() {
            var $ttModule = $('#ttModule');
            var nodes = $ttModule.tree('getChecked');
            for (var i = 0; i < nodes.length; i++) {
                var curNode = nodes[i];
                $ttModule.tree('uncheck', curNode.target);
            }
        }

        //点击保存
        function onclickSave() {

            var $dg = $("#dg");

            if (!endEditing()) { return false; }

            if ($dg.datagrid('getChanges').length == 0) { return false; }

            var inserted = $dg.datagrid('getChanges', 'inserted');
            var deleted = $dg.datagrid('getChanges', 'deleted');
            var updated = $dg.datagrid('getChanges', 'updated');
            var filterDeleted = [];
            for (var i = 0; i < deleted.length; i++) {
                if (deleted[i].Id) {
                    filterDeleted.push(deleted[i]);
                }
            }

            var postData = {
                lstInsert: inserted,
                lstDelete: filterDeleted,
                lstUpdate: updated
            };

            var url = '@Url.Action("Submit")';

            common.post(url, postData, function (result) {
                if (result) {
                    $dg.datagrid('acceptChanges');
                }
            });
        }

        function onclickDelete() {

            var $dg = $('#dg');

            var checkedRow = $dg.datagrid('getChecked');
            if (checkedRow.length == 0) {
                top.showAlert('请选择信息!', 'warning');
                return false;
            }

            for (var i = 0; i < checkedRow.length; i++) {
                var rowIndex = $dg.datagrid('getRowIndex', checkedRow[i]);
                if (editIndex == rowIndex) {
                    $dg.datagrid('cancelEdit', rowIndex)
                }
                $dg.datagrid('deleteRow', rowIndex);
            }
        }

        //分配模块
        function distributeModule() {

            var selectedRole = $('#dg').datagrid('getSelected');
            if (!selectedRole) {
                top.showAlert('请选择角色!', 'warning');
                return false;
            }


            var nodes = $('#ttModule').tree('getChecked', ['checked', 'indeterminate']);
            var modules = [];
            var actions = [];
            for (var i = 0; i < nodes.length; i++) {
                var curNode = nodes[i];
                if (curNode.attributes.type == 'module') {
                    modules.push(curNode.id);
                } else if (curNode.attributes.type == 'action') {
                    actions.push(curNode.id);
                }
            }

            var url = '@Url.Action("DistributeModuleAndAction", "Module")';
            var postData = {
                roleId: selectedRole.Id,
                moduleIds: modules,
                actionIds: actions
            }
            common.post(url, postData);
        }

        function onclickSearch() {
            $('#dg').datagrid({
                queryParams: {
                    name: $('#serhName').val()
                }
            });
        }
    </script>
}



